<template>
	<view class="flex-col page ">
		<view class="flex-col group">
			<view class="flex-col line-tabs">
				<view class="flex-col group_1">
					<view class="justify-between group_2">
						<!-- <text class="text_1" @click="go('/pages/index/plan/plan?status='+status)">近期安排</text> -->
						<text class="text_1" @click="goFuture">近期安排</text>
						<!-- <text class="text_2" @click="go('/pages/tool/material?status='+status)">全部规划</text> -->
						<text class="text_2" @click="aboutPlan">全部规划</text>
					</view>
					<view class="section_1"> </view>
				</view>

				<view class="u-page u-m-t-30 u-p-l-20 u-p-r-20">
					<view class="u-demo-block">

						<view class="u-demo-block__content ">
							<u-row justify="space-between flex-row justify-center align-center">
								<u-col span="3">
									<view
										class="boder-radio demo-layout border-color text_66 justify-center items-center">
										主材名称</view>
								</u-col>
								<u-col span="3">
									<view class="demo-layout border-color text_66 justify-center items-center">安排节点
									</view>
								</u-col>
								<u-col span="3" class="flex-col">
									<view class="flex-col demo-layout border-color text_66 justify-center items-center">
										据今天倒计时
										<view>(自然日)</view>
									</view>
								</u-col>
								<u-col span="3">
									<view
										class="boder-radio2 demo-layout border-color text_66 justify-center items-center">
										查看详情</view>
								</u-col>
							</u-row>
						</view>
					</view>
				</view>

				<view class="u-page u-p-l-20 u-p-r-20" v-if="arrange.length>0">
					<view class="u-demo-block" v-for="(item,index) in arrange" :key="index">

						<view class="u-demo-block__content " v-bind:class="[ index % 2 == 0 ? '' : activeClass]">
							<u-row justify="space-between flex-row justify-center align-center">
								<u-col span="3">
									<view class="demo-layout text_3 border-color1 justify-center items-center">
										{{item.materialName}}
									</view>
								</u-col>
								<u-col span="3">
									<view class="demo-layout text_3 border-color1 justify-center items-center">
										{{item.arrange}}
									</view>
								</u-col>
								<u-col span="3">
									<view class="demo-layout text_3 border-color1 justify-center items-center">
										{{item.time}}天
									</view>
								</u-col>
								<u-col span="3" @click="go('/pages/tool/material?status='+status)">
									<view class="demo-layout text_18 border-color1 justify-center items-center">
										查看</view>
								</u-col>
							</u-row>
						</view>
					</view>
				</view>
				<view class="u-m-t-50" v-else>
					<u-empty width="250" textSize="25" marginTop="50%" mode="list"
						icon="http://cdn.uviewui.com/uview/empty/list.png">
					</u-empty>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {

		components: {},
		data() {
			return {
				projectId: 0,
				arrange: [],
				isActive: true,
				activeClass: 'active',
				status: 0
			};
		},
		onLoad(option) {
			console.log(option)
			if (option.hasOwnProperty('orderid')) {
				this.projectId = option.orderid;
				// this.getOrder(this.orderid);
			} else {
				console.log(option)
			}
			if (option) {
				this.projectId = option
			}
			if (option.status) {
				this.status = option.status
				this.getArrange(this.status)
			}
		},

		methods: {
			aboutPlan() {
				uni.redirectTo({
					url: '/pages/tool/material?status=' + this.status
				})
			},
			goFuture() {
				uni.redirectTo({
					url: '/pages/index/plan/plan?status=' + this.status
				})
			},
			getArrange(status) { //订装安排
				this.$http('check.userarrange', {
					isDisplay: status
				}).then(res => {
					if (res.code == 200) {
						this.arrange = res.data
					}
				})
			},

		},
	};
</script>

<style scoped lang="scss">
	.active {
		background: #f2f6ff;
	}

	.wrap {
		padding: 12px;
	}

	.boder-radio {
		border-radius: 8rpx 0rpx 0rpx 8rpx;
	}

	.boder-radio2 {
		border-radius: 0rpx 10rpx 10rpx 0rpx;
	}

	.demo-layout {
		height: 25px;
	}

	.border-color {
		border: #dedede solid;
		border-width: 1px 0 1px 1px;
		height: 43px;
		background-color: #f2f6ff;
	}

	.border-color1 {
		border: #dedede solid;
		border-width: 1px 0 1px 1px;
		border-radius: 0px;
		height: 39px;
	}

	.bg-purple {
		background: #CED7E1;
	}

	.bg-purple-light {
		background: #e5e9f2;
	}

	.bg-purple-dark {
		background: #99a9bf;
	}

	.page {
		background-color: #ffffffff;
		width: 100%;
		overflow-y: auto;
		overflow-x: hidden;
		height: 100%;
	}

	.group {
		flex: 1 1 auto;
		overflow-y: auto;
	}

	.line-tabs {
		padding-bottom: 642rpx;
	}

	.group_1 {
		padding-left: 148rpx;
		padding-right: 147rpx;
		border-bottom: solid 1rpx #eeeeee;
	}

	.section_2 {
		margin: 32rpx 32rpx 0;
		padding-left: 30rpx;
		background-image: url('https://project-user-resource-1256085488.cos.ap-guangzhou.myqcloud.com/617a2ca7e4f1450011362b37/62b14c62d02982001153329a/16557868695335013438.png');
		background-position: 0% 0%;
		background-size: 100% 100%;
		background-repeat: no-repeat;
	}

	.group_2 {
		padding: 29rpx 0 25rpx;
	}

	.section_1 {
		margin-left: 31rpx;
		align-self: flex-start;
		background-color: #1d6aff;
		border-radius: 4rpx;
		width: 50rpx;
		height: 8rpx;
	}

	.group_3 {
		padding: 27rpx 0 36rpx;
		width: 127rpx;
		border-right: solid 1rpx #d9d9d9;
	}

	.group_4 {
		margin-left: 44rpx;
		align-self: center;
	}

	.group_5 {
		margin-left: 43rpx;
		border-left: solid 1rpx #d9d9d9;
	}

	.text_1 {
		font-weight: 800;
		color: #333333;
		font-size: 28rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 33rpx;
	}

	.text_2 {
		color: #666666;
		font-size: 28rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 33rpx;
	}

	.text_3 {
		color: #000000;
		font-size: 26rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 26rpx;
	}

	.text_66 {
		color: #666666;
		font-size: 26rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 26rpx;
	}

	.text_4 {
		margin-left: 21rpx;
		margin-top: 59rpx;
		color: #333333;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.text_5 {
		margin-left: 21rpx;
		margin-top: 58rpx;
		color: #333333;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.text_6 {
		margin-left: 21rpx;
		margin-top: 59rpx;
		color: #333333;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.text_7 {
		margin-left: 20rpx;
		margin-top: 59rpx;
		color: #333333;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.text_8 {
		color: #666666;
		font-size: 22rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 26rpx;
	}

	.text_9 {
		margin-top: 59rpx;
		color: #333333;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.text_10 {
		margin-top: 58rpx;
		color: #333333;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.text_11 {
		margin-top: 59rpx;
		color: #333333;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.text_12 {
		margin-top: 59rpx;
		color: #333333;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.group_6 {
		margin-top: 17rpx;
		padding: 0 22rpx;
		width: 183rpx;
	}

	.section_3 {
		background-color: #d9d9d9;
		width: 1rpx;
		height: 436rpx;
	}

	.group_7 {
		align-self: center;
		width: 156rpx;
	}

	.text_13 {
		color: #666666;
		font-size: 22rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 26rpx;
		text-align: center;
	}

	.text_14 {
		margin-top: 43rpx;
		align-self: center;
		color: #333333;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.text_15 {
		margin-top: 58rpx;
		align-self: center;
		color: #333333;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.text_16 {
		margin-top: 59rpx;
		align-self: center;
		color: #333333;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.text_17 {
		margin-top: 59rpx;
		align-self: center;
		color: #333333;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.text_18 {
		color: #1c4ca8;
		font-size: 22rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 26rpx;
	}

	.text_19 {
		margin-top: 59rpx;
		color: #1c4ca8;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.text_20 {
		margin-top: 58rpx;
		color: #1c4ca8;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.text_21 {
		margin-top: 59rpx;
		color: #1c4ca8;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}

	.text_22 {
		margin-top: 59rpx;
		color: #1c4ca8;
		font-size: 24rpx;
		font-family: '.AppleSystemUIFont';
		line-height: 28rpx;
	}
</style>
